import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { AtList, AtListItem, AtSwipeAction } from 'taro-ui'
import './labelManage2.scss'
import { $redirectTo } from '../../../global';
import reactMixin from 'react-mixin';
import myJs from './labelManage2Js.js'
import app from '../../../main.js'

export default class LabelManage extends Component {
    config = {
        navigationBarTitleText: '标签管理'
    }
    constructor() {
        super(...arguments);
        this.state = this.getData();
    }
    init() {
        this.allLabel();
    }
    afterAllLabel() {
        this.setState({
            labels: this.state.labels
        });
    }
    go(url) {
        app.redirectTo(url);
    }
    deleteOption(e){
        let id=e.target.dataset.id;
        console.log(id);
        for(let i=0;i<this.state.labels.items.length;i++){
            if(this.state.labels.items[i].id===id){
                this.state.labels.items.splice(i,1);
                // this.setState({
                //     labels:this.state.labels
                // })
                me.navigateTo('../updateLabel/updateLabel?id=labels.items.id');
            }
            if(this.state.checkedList.length!==0){
                 let delId=this.state.checkedList.indexOf(Number.parseInt(id));
                 if(delId!==-1){
                     this.state.checkedList.splice(delId,1);
                 }
            }
        }
    }

    render() {
        return (
            <View className='labelManage'>
                <AtList>
                    {this.state.labels.items.map((item,index) =>
                    <View onClick={this.deleteOption.bind(this)}>
                        <AtSwipeAction
                            key={index}
                            data-id={item.id}
                            autoClose={true}
                            options={[
                                {
                                    text: '修改',
                                    style: {
                                        backgroundColor: '#6190E8'
                                    }
                                },
                                {
                                    text: '刪除',
                                    style: {
                                        backgroundColor: '#FF4949'
                                    }
                                }
                            ]}>
                            <AtListItem title={item.name} />
                        </AtSwipeAction>
                        </View>
                    )}
                </AtList>
                <View className=' class_2'>
                    <Text className=' class_3' onClick={this.go.bind(this, '../createLabel/createLabel')}>创建标签</Text>
                </View>
            </View>
        );
    }
}
reactMixin.onClass(LabelManage, myJs);